<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html lang="en">
<head>
    <title>Progress Bar</title>
    <style>
    #layer{
     width:600px;
     height:300px;
     background:#ccc;
     border:1px solid #aaa;
     position:fixed;
     _position:absolute;    /* 勉强应付 IE6 */
     top:50%;
     right:50%;
     margin:-150px -300px 0 0;
     display:none;    /* 默认不显示 */
 }
 #close{
     position:absolute;
     top:0;
     right:0;
     font:20px/1 Arial;
     text-decoration:none;
 }
 </style>
 <script src="assets/scripts/jquery-1.7.1.min.js" type="text/javascript"></script>
    <script type="text/javascript">
	    $(document).ready(function(){
	     $('#layerBtn').click(function(){$('#layer').fadeIn();});    //弹出层
	     $('#close').click(function(){$('#layer').fadeOut();});      //关闭层
		 });
	</script>
 
</head>
<body>
<!-- Progress bar holder -->
<div id="progress" style="width:500px;border:1px solid #ccc;"></div>
<!-- Progress information -->
<div id="information" style="width"></div>
<?php
// Total processes
$total = 5;
 
// Loop through process
for($i=1; $i<=$total; $i++){
    // Calculate the percentation
    $percent = intval($i/$total * 100)."%";
 
    // Javascript for updating the progress bar and information
    echo '<script language="javascript">
    document.getElementById("progress").innerHTML="<div style=\"width:'.$percent.';background-color:#dddd00;\">&nbsp;</div>";
    document.getElementById("information").innerHTML="'.$i.' row(s) processed.";
    </script>';
 
    // This is for the buffer achieve the minimum size in order to flush data
    echo str_repeat(' ',1024 * 16);
 
    // Send output to browser immediately
    flush();
 
    // Sleep one second so we can see the delay
    sleep(1);
}
 
// Tell user that the process is completed
echo '<script language="javascript">document.getElementById("information").innerHTML="Process completed";window.close();' .
		'window.opener.location.href = "user_import.php?pro=sucess"</script>';
?>
</body>
</html>